<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" th:href="@{/css/payPage.css}">
    <link rel="stylesheet" th:href="@{/iconfont/iconfont.css}">
    <link rel="stylesheet" th:href="@{/layui/css/layui.css}">
</head>
<body>
<div class="outer9">
    <div class="inter1">
        <h1>确认订单</h1>
    </div>
    <div class="inter2">
        <div class="inter21">
            <span class="s2">商品名称</span><span class="s10">单价</span>
            <span class="s3">数量</span><span class="count">小计</span><span class="total">折扣价</span>
        </div>
        <div class="inter22">
            <ul>
                <li th:each="order:${userOrders}" th:object="${order}">
                    <img th:src="'/mall/image/'+*{product.mainImage}" alt="">
                    <span class="s1" th:text="*{product.name}">商品名称</span>
                    <span class="huodong">¥<span class="price" th:text="*{product.price}">0</span></span>
                    <span class="money" th:text="*{number}">1</span>
                    <span class="count">¥<span class="total" th:text="*{string1}">0</span></span>
                    <span class="money1" style="color:red">¥<span class="total" th:text="*{total}">0</span></span>
                </li>
            </ul>
        </div>
    </div>
    <div class="inter3">
        <div class="inter31">
            <div class="inter30">
                <span style="color: red" th:if="${not #strings.isEmpty(errormsg)}" th:text="${errormsg}"></span>
                <form id="paysure" class="layui-form" action="">
                    <div class="layui-form-item">
                        <label class="layui-form-label">收货人</label>
                        <div class="layui-input-block">
                            <input type="text" name="name" required  lay-verify="required" autocomplete="off" class="layui-input" th:value="${session.user.name}">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">联系电话</label>
                        <div class="layui-input-block">
                            <input type="text" name="phone" required  lay-verify="required|phone" autocomplete="off" class="layui-input" th:value="${session.user.telephone}">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">收货地址</label>
                        <div class="layui-input-block">
                            <input type="text" name="addr" required  lay-verify="required" autocomplete="off" class="layui-input" th:value="${session.user.address1}">
                        </div>
                    </div>
                </form>
            </div>
            <button class="paysure" onclick="confirm()">
                <span>确认支付</span>
            </button>
            <div class="foot">
                合计(不含运费) : <span class="totalPrice" th:text="'￥'+${order.total}">￥0</span>元<br>
                <!--                    <span class="ss3">已优惠 : <span class="ss4"> ¥0</span></span>-->
            </div>
        </div>
    </div>
</div>

</body>
<script th:src="@{/js/jqurey.js}"></script>
<script th:src="@{/layui/layui.js}"></script>
<script  type="text/javascript">
    layui.use('form', function () {
        var form = layui.form;
    });
    function getQueryVariable(variable)
    {
        var query = window.location.search.substring(1);
        var vars = query.split("&");
        for (var i=0;i<vars.length;i++) {
            var pair = vars[i].split("=");
            if(pair[0] == variable){return pair[1];}
            console.log(variable+':'+pair[1])
        }
        return(false);
    }
    $(function () {
        getData()
    })
    function getData() {
        var id=getQueryVariable("id")

        $.ajax({
            //请求方式
            type : "GET",
            //请求的媒体类型
            contentType: "application/json;charset=UTF-8",
            //请求地址
            url : "getDetail.do?id="+id,
            //请求成功
            success : function(result) {

            },
            error: function (e) {
                alert("请求失败")
            }
        });
    }
    function confirm() {
        var id=getQueryVariable("id")
        var name=$("input[name='name']").val()
        var phone=$("input[name='phone']").val()
        var addr=$("input[name='addr']").val()
        var data = {
            id:id,
            name:name,
            phone:phone,
            addr:addr
        }
        console.log(data)
        $.ajax({
            //请求方式
            type : "GET",
            //请求的媒体类型
            contentType: "application/json;charset=UTF-8",
            //请求地址
            url : "confirm.do?id="+id+"&name="+name+"&phone="+phone+"&addr="+addr,
            //请求成功
            success : function(result) {
                if(result.message=='成功'){
                    alert("购买成功")
                    window.location.href='/mall/user/toCenter.html'
                }
            },
            error: function (e) {
                alert("请求失败")
            }
        });
    }
</script>
</html>